
<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title> 工作量的统计 </title>
  <link rel="stylesheet" type="text/css" href="/css/style.css" />

  <style type="text/css">
    *, body {
      margin: 0px;
      font-family: '微软雅黑';
    }
    .button-container {
      float: right;
    }
  </style>
  <script src="/js/jquery-1.10.2.min.js"></script>
  <script src="/js/generic.js"></script>
  <script src="/js/fypage.js"></script>
</head>

<body>

<table class="maintable"style="width:100%">
  <tr>
    <td class="rightmaintd" valign="top">
      <div class="searchdiv">
        <div style="float: left;">
                        <span style="margin-left: 20px;">
                            <label>起始日期:</label><input type="date" id="begindate" class="yianinput">
                        </span>
          <span style="margin-left: 20px;">
                            <label>结束日期:</label><input type="date" id="enddate" class="yianinput">
                        </span>
            <label>录入人:<input type="text"  style="width:10%" id="createuser" onkeypress="enterKeyPress(event)"></label>
          <span style="margin-left: 30px;">
                            <label>查找项:</label>
                            <select id="yianItem" style="height:30px">
                                <option value="所有医案" selected="selected">所有医案</option>
                                <option value="新增医案">新增医案</option>
                                <option value="入库医案">入库医案</option>
                            </select>
                        </span>
          <input type="button" value="查询" class="chaxunbtn" onclick="search();"><img src="/images/fdj.png" alt="" class="searchfdj"></button>
        </div>

      </div>
      <table class="neirontbiao" id="tbl_list"style="width:100%"></table>
      <div class="button-container">
        <button id="prevButton">上一页</button>
        <button id="nextButton">下一页</button>
      </div>
      每页显示条数：
      <select id="pageSizeSelect" onchange="changePageSize();">
          <option value="10">10</option>
          <option value="25">25</option>
          <option value="50">50</option>
          <option value="100" selected>100</option>
          <option value="200">200</option>
      </select>
        <div class="pagediv" id="pager">
            <label>第
                <input type="text" id="page" style="width:30px" onkeypress="pageSearch(event)">
                页
            </label>
            <input type="button" value="跳转" onclick="pageOn()">
            <p id="sumPageId">place</p>
        </div>

    </td>
  </tr>
</table>


</body>
</html>
<script type="text/javascript">

  function start(){
    var xhr = new XMLHttpRequest();
    xhr.open('GET', '/workload/', true);
    xhr.onreadystatechange = function() {
      if (xhr.readyState === 4 && xhr.status === 200) {
        dataSource = JSON.parse(xhr.responseText);
          dataSource.forEach(function(obj) {
              for (var key in obj) {
                  if (obj.hasOwnProperty(key) && obj[key] === null) {
                      obj[key] = ''; // 将属性值为 null 的属性替换为空字符串
                  }
              }
          });
        data = JSON.parse(JSON.stringify(dataSource));
        console.log(data);
        renderData();
      }
    };
    xhr.send();
  }
  var begin = document.getElementById('begindate');
  var end = document.getElementById('enddate');
  var createuser = document.getElementById('createuser');
  var yianItem = document.getElementById('yianItem');
  var pageChage=document.getElementById('page');
  var sumPageShow=document.getElementById('sumPageId');
  var pageSize = 50; // 每页显示的数据量
  var currentPage = 1; // 当前页码
  var dataRender=[];  //每页显示的数据，是数据
  var pageSum=0;  //总共的页数
  var dataSource=[];   //一共有的json数据，源数据
  var data=[];  // 操作的数据，防止错误，可以由源数据赋值
  // 使用AJAX请求获取JSON数据
  start();
  function renderData(){    //渲染页面函数
    pageSum=Math.ceil(data.length/(pageSize));
    dataRender=data.slice((currentPage-1)*pageSize,pageSize*currentPage);
    var container = document.getElementById('tbl_list');
    var html = '<tr class="neirontbiaotou"><th width="10%">医案编号</th><th width="8%">创建者</th><th width="11%">创建时间</th><th width="8%">第一审核者</th><th width="11%">第一审核时间</th><th width="8%">分数</th><th width="8%">第二审核者</th><th width="11%">入库时间</th><th width="10%">文献状态</th></tr>';
    if (dataRender.length == 0) {
      html += '<tr><td colspan="11" style="text-align:center;height:50px;">暂无医案信息</td></tr>';
    }
    for (var i = 0; i < dataRender.length; i++) {
      var item = dataRender[i];
      html += '<tr>';
      html += '<td title="' + item.bianhao + '">' + item.biaohao + '</td>';
      html += '<td>' + item.createuser + '</td>';
      html += '<td>' + formDate(item.createtime) + '</td>';
      html += '<td>' + item.firstcheckuser + '</td>';
      html += '<td>' + formDate(item.firstchecktime) + '</td>';
      html += '<td>' +item.firstcheckfenshu + '</td>';
      html += '<td>' + item.secondcheckuser + '</td>';
      html += '<td>' + formDate(item.secondchecktime) + '</td>';
      html += '<td>' + item.shenhe + '</td>';

    }
    pageChage.innerHTML=currentPage;
    sumPageShow.textContent="第"+currentPage+"页/ "+pageSum+" 页";
    container.innerHTML = html;
  }
  function formDate(sqlDate){
      if(sqlDate=='')
          return '';
// 将字符串转换为 JavaScript Date 对象
      const date = new Date(sqlDate);
// 获取年、月、日
      const year = date.getFullYear();
      const month = String(date.getMonth() + 1).padStart(2, "0"); // 注意月份需要加 1
      const day = String(date.getDate()).padStart(2, "0");
// 构建年-月-日格式的字符串
      return `${year}-${month}-${day}`;
  }
  function nextOrPreOnClick(){
      //上一页
      var prevButton = document.getElementById('prevButton');
      prevButton.addEventListener('click', function() {
          currentPage--;
          if(currentPage==0)
              currentPage=pageSum;
          renderData();

      });

      // 下一页按钮点击事件处理函数
      var nextButton = document.getElementById('nextButton');
      nextButton.addEventListener('click', function() {
          currentPage=(++currentPage)%pageSum;
          currentPage=currentPage==0?pageSum:currentPage;
          renderData();
      });
  }
  function changePageSize(){
      var pageSizeSelect = document.getElementById('pageSizeSelect');
      pageSize = parseInt(pageSizeSelect.value);
      currentPage=1;
      renderData();
  }
  nextOrPreOnClick();
  function search() {
      currentPage = 1;
      data = [];
      var beginVal = begin.value;
      var endVal = end.value;
      var cuVal=createuser.value.toUpperCase();
      var yianitemVal = yianItem.value;
      console.log("开始"+beginVal )
      console.log("结束"+endVal)
      console.log("结"+yianitemVal)
      // var smVal = sm.value.toUpperCase();
      // var zzVal = zz.value.toUpperCase();
      // var hzVal = hz.value.toUpperCase();

      if (beginVal == ""&&cuVal==""&&endVal==""&&yianitemVal=="所有医案") {
          data = JSON.parse(JSON.stringify(dataSource));
      }
      else {
          if(yianitemVal=="所有医案"){
              for (var i = 0; i < dataSource.length; i++) {
                  if ((dataSource[i].createtime>=beginVal  && dataSource[i].createtime<=endVal&&dataSource[i].createuser.toUpperCase().includes(cuVal))||
                      (dataSource[i].secondchecktime>=beginVal  && dataSource[i].secondchecktime<=endVal&&dataSource[i].createuser.toUpperCase().includes(cuVal))) {
                      data.push(dataSource[i]);
                  }
              }
          }
          if(yianitemVal=="新增医案"){
              for (var i = 0; i < dataSource.length; i++) {
                  if (dataSource[i].createtime>=beginVal  && dataSource[i].createtime<=endVal&&dataSource[i].createuser.toUpperCase().includes(cuVal)) {
                      data.push(dataSource[i]);
                  }
              }
          }
          if(yianitemVal=="入库医案"){
              for (var i = 0; i < dataSource.length; i++) {
                  if (dataSource[i].secondchecktime>=beginVal  && dataSource[i].secondchecktime<=endVal&&dataSource[i].createuser.toUpperCase().includes(cuVal)) {
                      data.push(dataSource[i]);
                  }
              }
          }

      }
      renderData();
  }
  function enterKeyPress(event) {
      // 检查按下的按键是否为回车键，回车键的keyCode是13
      if (event.keyCode === 13) {
          search();
      }
  }
  function pageSearch(event) {
      // 检查按下的按键是否为回车键，回车键的keyCode是13
      if (event.keyCode === 13) {
          pageOn();
      }
  }
  function pageOn(){
      var afterPage=pageChage.value;
      if(afterPage<1||afterPage>pageSum){
          alert("输入的页码错误！");
          return;
      }
      currentPage=afterPage;
      renderData();
  }
</script>